<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户中心</title>
    <script src="../js/Jquery.js"></script>
    <link rel="stylesheet" href="../../../web框架/bootstrap-3.4.1-dist/css/bootstrap.css">
    <link rel="stylesheet" href="../css/user.css">
</head>

<body>
    <div class="mzsc">
        <div class="mzsc_Content">
            <div class="top">
                <div class="top_bx">
                    <div class="wel cf">
                        <p>您好 欢迎来到美妆商城!</p>
                        <a href="JavaScript:;">请登录</a>
                        <a href="file:///D:/study/practise/mzsc_new/html/register.html">立即注册</a>
                    </div>
                    <div class="top_nav">
                        <a href="javascript:;">我的美妆</a>
                        <a href="javascript:;" class="brand_tit">
                            <p class="brand_txt">关注品牌</p>
                        </a>
                        <a href="javascript:;">购物车</a>
                        <a href="javascript:;">收藏夹</a>
                        <a href="javascript:;">商家入驻</a>
                        <a href="javascript:;" style="border-right: none;">帮助中心</a>
                        <div class="top_brand">
                            <a href="javascript:;">科颜氏</a>
                            <a href="javascript:;">雪花秀</a>
                            <a href="javascript:;">馥苗诗</a>
                            <a href="javascript:;">奥比虹</a>
                            <a href="javascript:;">希思黎</a>
                            <a href="javascript:;">迪奥</a>
                            <a href="javascript:;">香奈儿</a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="head">
                <div class="head_bx">
                    <div class="head_top">
                        <img src="../images/mzsc.png" alt="图片加载中..">
                        <div class="head_search">
                            <input type="text" placeholder="请输入关键字">
                            <div class="search_btn">
                                <img src="../images/search.png" alt="图片加载中..">
                            </div>
                        </div>
                        <div class="head_ewm cf">
                            <p class="head_txt">关注微信</p>
                            <div class="head_erweima">
                                <img src="../images/二维码.png" alt="图片加载中...">
                            </div>
                        </div>
                    </div>
                    <div class="head_nav cf">
                        <div class="product_all">
                            <p>所有产品类型</p>
                        </div>
                        <div class="head_product">
                            <a href="javascript:;">首页</a>
                            <a href="javascript:;">官方直售</a>
                            <a href="javascript:;">会员专属</a>
                            <a href="javascript:;">线上专柜</a>
                        </div>
                    </div>
                </div>
            </div>
            <div class="content cf">
                <!-- 左侧tab卡 -->
                <div class="cont_tab">
                    <div class="user">
                        用户中心
                    </div>
                    <div class="userinfo">
                        <h3 class="cont_tab_tit">资料管理</h3>
                        <p>个人资料</p>
                        <p>实名认证</p>
                        <p class="cont_tab_on">收货信息</p>
                    </div>
                    <div class="orderinfo">
                        <h3 class="cont_tab_tit">订单管理</h3>
                        <p>全部订单</p>
                        <p>未支付订单</p>
                        <p>已支付订单</p>
                    </div>
                    <div class="mytrade">
                        <h3 class="cont_tab_tit">我的交易</h3>
                        <p>我的关注</p>
                        <p>我的收藏</p>
                        <p>我的评价</p>
                    </div>
                </div>
                <!-- 个人资料 -->
                <div class="grzl_cont public_cont">
                    <div class="grzl.tit public_tit">
                        <span>*</span>个人资料
                    </div>
                </div>
                <!-- 实名认证 -->
                <div class="smrz_cont public_cont">
                    <div class="smrz.tit public_tit">
                        <span>*</span>实名认证
                    </div>
                </div>
                <!-- 收货信息 -->
                <div class="shxx_cont public_cont" style="display: block;">
                    <div class="shxx.tit public_tit">
                        <span>*</span>收货信息
                    </div>
                    <div class="shxx">
                        <table class="table">
                            <thead>
                                <tr style="background-color: #f1f1f1;" >
                                    <th>收货人地址</th>
                                    <th>联系电话</th>
                                    <th>详细地址</th>
                                    <th>是否默认地址</th>
                                    <th>操作</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>
                                        张三
                                    </td>
                                    <td>
                                        110
                                    </td>
                                    <td>
                                        北京市 背景辖区 东城区
                                    </td>
                                    <td>
                                        是
                                    </td>
                                    <td>
                                        <button class="btn btn-success">编辑</button>
                                        <button class="btn btn-danger">删除</button>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                        <div class="add_shxx">
                            <span>添加新的收货地址</span>
                        </div>
                    </div>
                    <div class="shxx_set" style="display: none;">
                        <p class="set_name">
                            <span>*</span>收件人：
                            <input type="text" placeholder="请输入收件人名称">
                        </p>
                        <p class="set_iphone">
                            <span>*</span>手机号：
                            <input type="text" placeholder="请输入手机号码">
                        </p>
                        <div class="set_address">
                            <span>*</span>详细地址：
                            <select name="shengfen" id="sf">
                                <option value="0" disabled selected>请选择省份</option>
                            </select>
                            <select name="city" id="sq">
                                <option value="0" disabled selected>请选择市区</option>
                            </select>
                            <select name="xiancheng" id="xc">
                                <option value="0" disabled selected>请选择县城</option>
                            </select>
                            <input type="text" placeholder="请输入详细地址">
                        </div>
                        <p>
                            设置为默认：<input type="checkbox" id="mr">
                        </p>  
                        <div class="set_btn">
                            <button id="set_yes">提交</button>
                            <button id='set_no'>返回</button>
                        </div>                     
                    </div>
                </div>
                <!-- 全部订单 -->
                <div class="all_dd_cont public_cont">
                    <div class="all_dd.tit public_tit">
                        <span>*</span>全部订单
                    </div>
                    <div class="all_dd">

                    </div>
                </div>
                <!-- 未支付订单 -->
                <div class="no_dd_cont public_cont">
                    <div class="no_dd.tit public_tit">
                        <span>*</span>未支付订单
                    </div>
                    <div class="no_dd">

                    </div>
                </div>
                <!-- 已支付订单 -->
                <div class="yes_dd_cont public_cont">
                    <div class="yes_dd.tit public_tit">
                        <span>*</span>已支付订单
                    </div>
                    <div class="yes_dd">

                    </div>
                </div>
            </div>

            <div class="footer">
                <div class="footer_nav">
                    <div class="fnav_cont">
                        <div>
                            <h3>购物指南</h3>
                            <p>新手指南</p>
                            <p>新手指南</p>
                            <p>新手指南</p>
                            <p>新手指南</p>
                        </div>
                        <div>
                            <h3>关于我们</h3>
                            <p>关于我们</p>
                            <p>加入我们</p>
                            <p>联系我们</p>
                        </div>
                        <div>
                            <h3>支付方式</h3>
                            <p>快捷支付</p>
                            <p>信用卡</p>
                            <p>货到付款</p>
                        </div>
                        <div>
                            <h3>商家服务</h3>
                            <p>商家入驻</p>
                            <p>商家中心</p>
                            <p>物流服务</p>
                        </div>
                        <div>
                            <h3>关注微信</h3>
                            <p class=nav_erweima>
                                <img src="../images/二维码.png" alt="">
                            </p>
                        </div>
                    </div>
                </div>
                <div class="footer_bq">
                    <div class="bq_bx">
                        <div class="bq_nav">
                            <a href="javascript:;">天猫</a>
                            <a href="javascript:;">京东</a>
                            <a href="javascript:;">YunOS</a>
                            <a href="javascript:;">阿里通信</a>
                            <a href="javascript:;">万网</a>
                            <a href="javascript:;">高德</a>
                            <a href="javascript:;">优视</a>
                            <a href="javascript:;">友盟</a>
                            <a href="javascript:;">虾米</a>
                            <a href="javascript:;">天天动听</a>
                        </div>
                        <div class="banquan">
                            Copyright © 2008-2016 vip.com，All Rights Reserved 粤ICP备08114786号
                        </div>
                        <div class="banquan">
                            版权所有 美妆商城
                        </div>
                    </div>
                </div>
            </div>
            <div class="mzsc_right">
                <div class="my_function">
                    <div class="my_mz public_right">
                        <div>我的美妆</div>
                        <img src="../images/my_mz.jpg" alt="">
                    </div>
                    <div class="my_gwc public_right">
                        <div>我的购物车</div>
                        <img src="../images/my_gwc.jpg" alt="">
                    </div>
                    <div class="my_history public_right">
                        <div>我看过的</div>
                        <img src="../images/my_history.jpg" alt="">
                    </div>
                    <div class="my_bornd public_right">
                        <div>关注品牌</div>
                        <img src="../images/my_bornd.jpg" alt="">
                    </div>
                    <div class="my_collect public_right">
                        <div>我的收藏</div>
                        <img src="../images/my_collect.jpg" alt="">
                    </div>
                    <div class="back_top public_right">
                        <div>返回顶部</div>
                        <img src="../images/back_top.jpg" alt="">
                    </div>
                </div>
            </div>
        </div>
    </div>
</body>
<script src="../js/user.js"></script>

</html>